<template>
  <div id="userOrder">

    <a-form v-model="roomInfo" label-width="60px" ref="roomInfo">
      <!-- <a-form-item label="房型">
        <el-select v-model="roomInfo.rt_id">
          <el-option
            v-for="(item) in roomTypeOpt"
            :key="item.id"
            :label="item.label"
            :value="item.id"
          ></el-option>
        </el-select> -->

      <a-form-item label="手机号" prop="userPhone">
        <a-input v-model="roomInfo.userPhone" placeholder="请输入手机号" style="width:218px"></a-input>
      </a-form-item>
      <a-form-item label="订房数量" prop="userPhone">
        <a-input v-model="roomInfo.roomNumber" placeholder="请输入订房数量" style="width:218px"></a-input>
      </a-form-item>
      <a-form-item label="订房时间" prop="orderTime">
        <div class="block">
          <!-- <span class="demonstration">入住时间为订房日14:00:00</span>
          <el-date-picker
            v-model="roomInfo.arriveDate"
            type="datetime"
            placeholder="选择日期时间"
            default-time="14:00:00"

            :picker-options="expireTimeOption"
          ></el-date-picker>
          <span class="demonstration">最晚退费时间为退费日 12:00:00</span>
          <el-date-picker
            v-model="roomInfo.leaveDate"
            type="datetime"
            placeholder="选择日期时间"
            default-time="12:00:00"

            :picker-options="expireTimeOption2"
          ></el-date-picker> -->
          <a-form-item>
           <span class="demonstration">入住时间</span>
            <el-date-picker
              v-model="roomInfo.arriveDate"
              type="date"
              placeholder="选择日期"
              :picker-options="expireTimeOption">
            </el-date-picker>
          </a-form-item>
            <a-form-item>
            <span class="demonstration">退费房间</span>
            <el-date-picker
              v-model="roomInfo.leaveDate"
              type="date"
              :picker-options="expireTimeOption2"
              placeholder="选择日期">
            </el-date-picker>
            </a-form-item>
        </div>
      </a-form-item>
      <a-form-item label="备注">
        <a-input v-model="roomInfo.user_remark" placeholder="请输入备注" style="width:218px"></a-input>
      </a-form-item>
      <el-button type="primary" @click="getOrderTest">保存</el-button>
    </a-form>
  </div>
</template>

<script>
export default {
  name: "userOrder",
  data() {
    return {

      date: new Date(),
      dialogTitle: "预定房间",
      roomData: [],
      roomDialogVisible: false,
      roomTypeOpt: [
        { id: 1, label: "单人房88一天" },
        { id: 2, label: "双人房168一天" },
        { id: 3, label: "大床房128一天" }
      ],
      roomInfo: {
        //#{userPhone},#{user_remark},#{roomNumber}
        rt_id: "",
        order_time: "",
        arriveDate: "",
        leaveDate: "",
        userPhone: "",
        ordermoney: "",
        user_remark: "",
        roomNumber:'',
        order_Rooms:[] //数组, #{rt_id},#{in_date},#{out_date}
      },
      editRoom: false,
      currentRoomNo: "",
      expireTimeOption: {
        disabledDate(date) {
          return date.getTime() <= Date.now();

        }
      },
      expireTimeOption2: {
        disabledDate(date) {

         return (date.getTime() >= (Date.now() + (15 * 24 * 60 * 60 * 1000))) || date.getTime() <= Date.now();;
        }
      }
    };
  },
  filters: {
    // formatDateTime(value) {
    //   let date = new Date(value);
    //   let y = date.getFullYear();
    //   let MM = date.getMonth() + 1;
    //   MM = MM < 10 ? "0" + MM : MM;
    //   let d = date.getDate();
    //   d = d < 10 ? "0" + d : d;
    //   let h = date.getHours();
    //   h = h < 10 ? "0" + h : h;
    //   let m = date.getMinutes();
    //   m = m < 10 ? "0" + m : m;
    //   let s = date.getSeconds();
    //   s = s < 10 ? "0" + s : s;
    //   return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
    // }
    formatDate(time) {
      let date = new Date(time)
      return formatDate(date, 'yyyy-MM-dd')
    }
  },
  computed: {},
  mounted() {
    var that = this;
    this.timer = setInterval(() => {
      that.date = new Date(); //修改数据date
    }, 1000);
  },

  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer); //在Vue实例销毁前，清除我们的定时器
    }
  },
  methods: {
    formatDateTime1(value) {
      let date = new Date(value);
      let y = date.getFullYear();
      let MM = date.getMonth() + 1;
      MM = MM < 10 ? "0" + MM : MM;
      let d = date.getDate();
      d = d < 10 ? "0" + d : d;
      let h = date.getHours();
      h = h < 10 ? "0" + h : h;
      let m = date.getMinutes();
      m = m < 10 ? "0" + m : m;
      let s = date.getSeconds();
      s = s < 10 ? "0" + s : s;
      return y + "-" + MM + "-" + d;
    },
    getOrderTest: function() {
      this.roomInfo.order_time = this.date;
      if (this.$store.getters.getRoomType == 2) {
        this.roomInfo.rt_id = 2
        this.roomInfo.ordermoney = 88;
      } else if (this.$store.getters.getRoomType == 1) {
        this.roomInfo.rt_id = 1
        this.roomInfo.ordermoney = 168;
      } else if (this.$store.getters.getRoomType == 3) {
        this.roomInfo.rt_id = 3
        this.roomInfo.ordermoney = 128;
      } else {
        alert("请选择房型");
      }
      this.roomInfo.order_Rooms = [];
      this.roomInfo.arriveDate = this.formatDateTime1(this.roomInfo.arriveDate);
      this.roomInfo.leaveDate = this.formatDateTime1(this.roomInfo.leaveDate);
      for(var i = 0; i < this.roomInfo.roomNumber; i++){
        let order_room = {rt_id:this.roomInfo.rt_id, in_date:this.roomInfo.arriveDate, out_date:this.roomInfo.leaveDate}
        this.roomInfo.order_Rooms.push(order_room);
      }
      var data = JSON.stringify(this.roomInfo);
      console.log(data);
      this.$axios
        .post("/ssms/common/addOrderByU_id", data, {
          headers: {
            "Content-Type": "application/json",
            responseType: "application/json"
          }
        })
        .then(res => {
            if (res.data.code === 0) {
                alert("预订成功");
                this.$router.push("/userView/myself/orderChange");
            } else if (res.data.code === 1) {
                this.$alert(res.data.obj, "预订失败", {
                    confirmButtonText: "确定",
                    callback: action => {
                        this.$message({
                            type: "info",
                            message: `action: ${action}`
                        });
                    }
                });
            }
        })
        .catch(err => {
          console.log(err);
        });
    }
  }
};
</script>

<style>
</style>
